/** @jsxImportSource @emotion/react */
import * as React from "react";
import {
  CCell, Cell, Table, TableBody, TableRow, Text, TableHead,
} from "customize-easy-ui-component";
import {DirectLink} from "../../../routing/Link";
import {item宏观检验o} from "./annAttach";

//年度检查报告附页
export const 年度检查附页= ({theme, orc, rep} :{theme: any, orc:any, rep:any}
) => {
  //底下这个变量 render 每一次都要多次计算的： 【局部修改】递变地 变量。
  let inherSpan=0;     //每一行配置可能继承上面的行配置受到前面span所影响：item宏观检验o 配置模型的
  return <>
    <div css={{
      display: 'flex',
      justifyContent: 'space-between'
    }}>
      <Text></Text>
      <Text>报告编号：{rep.isp.no}</Text>
    </div>
    <Table fixed={["4.5%", "6%", "20%", "18%", "%"]} css={{borderCollapse: 'collapse'}} tight  miniw={800}>
      <TableHead>
        <DirectLink href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/ALL`}>
          <TableRow>
            <CCell><Text css={{fontSize:'0.7rem'}}>序号</Text></CCell><CCell colSpan={2}>检 验 项 目</CCell><CCell>检验结果</CCell><CCell>备&nbsp;&nbsp;注</CCell>
          </TableRow>
        </DirectLink>
      </TableHead>
      <TableBody>
        <DirectLink href={`/report/${rep?.modeltype}/ver/${rep?.modelversion}/${rep?.id}/AnnAttachment#AnnAttachment`}>
          { item宏观检验o.map(([name,conf,adddesc]: any, i:number) => {
            const {t: title, pr: prefix, span}=conf;          //从模型提取参数
            if(span)  inherSpan=span;
            else if(inherSpan>0)  inherSpan--;
            return <TableRow key={i}>
                <CCell>{i+1}</CCell>
                {prefix && <CCell split={true} rowSpan={span??1}>{prefix}</CCell>}
                {inherSpan>0?  <CCell>{adddesc? orc?.[name]?.a??'／' : title}</CCell>
                    :
                    <CCell colSpan={2}>{adddesc? orc?.[name]?.a??'／' : title}</CCell>
                }
                <CCell>{orc?.[name]?.r??'无此项'}</CCell>
                <Cell split={true} ><div css={{whiteSpace: 'pre-wrap'}}>
                  {orc?.[name]?.m??'／'}
                </div></Cell>
              </TableRow>
          }) }
          <TableRow>
            <Cell split={true} colSpan={5}><div css={{minHeight: '5rem', whiteSpace: 'pre-wrap'}}>
              说明：表中检验项目备注无法说明清楚的，可在本栏中进一步将缺陷（问题）情况描述清楚。<br/>
              {orc?.宏观结果??'／'}
            </div></Cell>
          </TableRow>
        </DirectLink>
      </TableBody>
    </Table>
    <Table fixed={ ["62%","%"]  }  css={ {borderCollapse: 'collapse' } } tight  miniw={800}>
      <TableBody>
        <TableRow>
          <CCell><div css={{height: '100%',display: 'flex',justifyContent: 'space-between',alignContent: 'space-between',alignItems: 'flex-start'}}>
            <div><Text>检验：</Text>    </div>
            <div css={{textAlign: 'end'}}><Text >日期</Text>2022-12-31</div>
          </div></CCell>
          <CCell><div css={{height: '100%',display: 'flex',justifyContent: 'space-between',alignContent: 'space-between',alignItems: 'flex-start'}}>
            <div><Text >审核：</Text>  </div>
            <div css={{textAlign: 'end'}}><Text >日期</Text>2021-01-31</div>
          </div></CCell>
        </TableRow>
      </TableBody>
    </Table>
  </>;
};

